<template>
	<d2-container>
		<template>
			<el-button slot="header" type="primary" @click="add">新 增</el-button>
			
			<el-table :data="tableData" stripe border>
				<el-table-column type="index" label="序号" width="50"></el-table-column>
				
				<el-table-column prop="categoryPicture" label="分类图片" width="140" align="center">
					<template slot-scope="scope">
						<el-image v-if="scope.row.categoryPicture" style="width: 50px; height: 50px" :src="scope.row.categoryPicture"></el-image>
					</template>
				</el-table-column>
				
				<el-table-column prop="categoryName" label="分类名称"></el-table-column>
				<el-table-column prop="categoryCode" label="分类编码" width="160"></el-table-column>
				<el-table-column prop="sort" label="排序" width="120" align="center"></el-table-column>
				
				<el-table-column prop="categoryType" label="类型" width="160" align="center">
					<template slot-scope="scope">
						<el-tag type="warning" v-if="scope.row.categoryType == 1">平台推荐</el-tag>
						<el-tag v-if="scope.row.categoryType == 0">平台自营</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="isEnable" label="是否启用" width="130" align="center">
					<template slot-scope="scope">
						<el-tag type="danger" v-if="scope.row.isEnable==0">否</el-tag>
						<el-tag type="success" v-if="scope.row.isEnable==1">是</el-tag>
					</template>
				</el-table-column>
				
				<el-table-column prop="remark" label="备注" width="160"></el-table-column>
				<el-table-column prop="createTime" label="创建时间" width="180" :formatter="forDateCreate"></el-table-column>
				<el-table-column prop="reviseTime" label="修改时间" width="180" :formatter="forDateRevise"></el-table-column>
				
				<el-table-column fixed="right" label="操作" width="120">
					<template slot-scope="scope">
						<el-button type="warning" size="small" @click="edit(scope.row)">编辑</el-button>
						<!-- <el-button @click.native.prevent="delete(scope.row)" type="info" size="small">删除</el-button> -->
					</template>
				</el-table-column>
			</el-table>
		</template>
		
		<template>
			<platform-category-handle
				:isShow="showHandleDialog"
				:isEdit="isEdit"
				:item="currentItem"
				@submit="getData"
				@close="closeHandleDialog"
			></platform-category-handle>
		</template>
	</d2-container>
</template>

<script>
	import { getPlatformCategory } from '@api/platform/platformCategory'
	import platformCategoryHandle from './components/platform-category-handle'
	import dayjs from 'dayjs'
	export default {
		components: {
			platformCategoryHandle,
		},
		data() {
			return {
				tableData: [],
				
				showHandleDialog: false, //添加弹窗
				isEdit: false,
				currentId: 0,
				currentItem: {}
			}
		},
		methods: {
			getData() {
				getPlatformCategory()
					.then(res => {
						this.tableData = res.data;
					})
			},
			forDateCreate(row, column) {
				return row.createTime == null ? "" : dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss')
			},
			forDateRevise(row, column) {
				return row.reviseTime == null ? "" : dayjs(row.reviseTime).format('YYYY-MM-DD HH:mm:ss')
			},
			
			// 列表操作
			add() {
				this.showHandleDialog = true;
			},
			edit(item) { //编辑
				this.currentItem = item;
				this.isEdit = true;
				this.showHandleDialog = true;
			},
			closeHandleDialog() {
				this.showHandleDialog = false;
				this.isEdit = false;
			},
		},
		mounted() {
			this.getData();
		}
	}
</script>

<style>
</style>